<template>
<div class="recruit_container">
    <div v-for="(item,key) in RecruitInfo" :key="key">
        <el-card class="recruit_card">
            <div>
                <span>发起人：</span>
                <span>{{item.sponsor}}</span>
            </div>
            <div>
                <el-row>
                  <el-col :span="6">
                        <span>工作地点：</span>
                        <span>{{item.work_address}}</span>
                    </el-col>
                    <el-col :span="6">
                        <span>工作类型：</span>
                        <span>{{item.kind}}</span>
                    </el-col>
                </el-row>
            </div>
            <div>
                <el-row>
                  <el-col :span="6">
                    <span>工作时长：</span><span>{{item.duration}}</span>
                  </el-col>
                  <el-col :span="6">
                      <span>工资：</span><span style="margin-right: 20px">{{item.salary}}</span>
                  </el-col>
                  <el-col :span="6">
                        <span>所需人数：</span><span>{{item.need_number}}人</span>
                  </el-col>
                </el-row>
            </div>
            <div>
                <span>工作介绍：</span>
                <div>
                    <span>{{item.introduction}}</span>
                </div>
            </div>
            <div>
                <span>是否审核通过:</span>
                <el-tag v-show="item.is_pass == 0 ? true : false" type="info">未审核</el-tag>
                <el-tag v-show="item.is_pass == 1 ? true : false" type="danger">已审核未通过</el-tag>
                <el-tag v-show="item.is_pass == 2 ? true : false">已审核通过</el-tag>
            </div>
        </el-card>
    </div>
    <el-pagination
                @current-change="handleCurrentChange($event,index)"
                background
                layout="prev, pager, next"
                :current-page="currentPage"
                :page-size="pageSize"
                :total="total">
            </el-pagination>
</div>
</template>

<script>
export default {
  data () {
    return {
      RecruitInfo: [],
      total: '',
      currentPage: '',
      pageSize: ''
    }
  },
  methods: {
    getRecruit () {
      this.$axios.get('publishInfo/getInfo', {
        params: {
          current: 1,
          size: 20,
          mytype: this.$route.params.mytype
        }
      }).then(response => {
        console.log(response.data)
        this.$set(this, 'RecruitInfo', response.data.data.records)
        this.total = response.data.data.total
        this.pageSize = response.data.data.size
        this.currentPage = response.data.data.current
      }).catch(error => {
        console.log(error)
      })
    },
    handleCurrentChange (val, index) {
      this.$axios.get('publishInfo/getInfo', {
        params: {
          current: val,
          size: 20,
          mytype: 0
        }
      }).then(response => {
        console.log(response.data)
        this.$set(this, 'RecruitInfo', response.data.data.records)
        this.total = response.data.data.total
        this.pageSize = response.data.data.size
        this.currentPage = response.data.data.current
      }).catch(error => {
        console.log(error)
      })
    }
  },
  mounted () {
    this.getRecruit()
  }
}
</script>

<style lang="less" scoped>
.recruit_container{
    margin-top: 20px;
    margin-left: 3%;
    margin-right: 35px;
    width: 94.3%;
}
.recruit_card{
    margin-bottom: 20px;
}
</style>
